<template>
  <div>
    <div v-for=" o in orders">
      <el-row class="mytop">
        <el-col :span="20"  >
          <el-table  v-loading="loading"
                     element-loading-spinner="el-icon-loading"
                     border :data="o.ordersDetails" :span-method="objectSpanMethod">
            <el-table-column width="250" >
              <template slot="header" >
                订单号:{{o.pid}}
              </template>
              <template slot-scope="scope">
                <img :src="scope.row.shopInfo.imags[0].imagUrl"
                     width="80px" height="100px" alt="err">
              </template>
            </el-table-column>
            <el-table-column label="商品" prop="shopInfo.shopName"></el-table-column>
            <el-table-column label="单价(元)" prop="shopInfo.shopPrice"></el-table-column>
            <el-table-column label="数量" prop="buyQuantity"></el-table-column>
            <el-table-column label="总价格" prop="sumPrice"></el-table-column>
            <el-table-column label="交易状态">
              <template>
                <el-tag type="success">用户退货</el-tag>
                </template>
            </el-table-column>
            <el-table-column>
              <template slot="header">
                <el-button circle icon="el-icon-refresh-right" size="mini" @click="l"></el-button>
              </template>
              <template slot-scope="scope">
                <el-link
                  @click="returnview(scope.row)"
                  type="primary"
                >查看详情
                </el-link>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>

    </div>
    <Return_to_view_details ref="view"></Return_to_view_details>
    <el-empty description="暂无数据" v-if="orders.length=='0'"></el-empty>
  </div>
</template>

<script>
  import Return_to_view_details from "../return/Return_to_view_details";
  export default {
    name: "revenue",
    data(){
      return{
        orders:[],
        pageno: 1,
        pagesize: 5,
        total: 1,
        loading: true
      }
    },
    methods:{
      getordersSalesReturndata(){
        var obj={
          loginUserId:sessionStorage.getItem("id"),
          pageno:this.pageno,
          pagesize:this.pagesize,
        }
        this.$axios.get("CAOKEordersReturn.action",{params:obj}).then(res=>{


          this.orders=res.data.records;
          this.total=res.data.originalData.length;
          console.log(this.orders)
          this.orders.forEach(item=>{
            item.ordersDetails.forEach(item2=>{
              item2.shopInfo.imags.forEach(item3=>{
                item3.imagUrl="http://127.0.0.1:9090/demo/"+item3.imagUrl;
              })
            })
          })
          this.loading=false;
        }).catch(error=>{
          this.$message.error(error)
        })
      },
      returnview(row){
        this.$refs.view.getDataReturn(row);
      },
      //合并方法
      objectSpanMethod({row, column, rowIndex, columnIndex}) {
        //合并列

        if (columnIndex === 5 ) {
          if (rowIndex  === 0 ) {
            let o1=  this.orders.find(item=> item.id = row.pid);
            return {
              rowspan: o1.ordersDetails.length,
              colspan: 1
            };
          } else {
            return {
              rowspan: 0,
              colspan: 0
            };
          }
        }

      },
      l(){
          this.getordersSalesReturndata()
      }
    },
    components:{
      Return_to_view_details
    },
    created() {
      this.getordersSalesReturndata()
    }
  }
</script>

<style scoped>

</style>
